<template>
  <div>
    <form class="layui-form  analysis-statistics-form" action="save" method="post" lay-filter="statisticsform"
          style="height: 100%;"
    >
      <div class="layui-inline  set-statistics-div">
        <div class="layui-form-item">
          <div class="statisticBtns">
            <div class="tablename">分析结果统计表</div>
<!--            <el-button v-show="showBtnBar" round size="mini" name="showStatisticBar" type="success"-->
<!--                       @click="showStatisticBar" plain-->
<!--            >柱状图-->
<!--            </el-button>-->
<!--            <el-button v-show="showBtnTJB" round size="mini" name="showStatisticTable" style="margin-left: 20px;"-->
<!--                       type="success" plain @click="showStatisticTable"-->
<!--            >统计表-->
<!--            </el-button>-->

<!--            <el-button v-show="showBtnBZT" round size="mini" name="showStatisticPie" style="margin-left: 20px;"-->
<!--                       type="success" plain @click="showStatisticPie"-->
<!--            >饼状图-->
<!--            </el-button>-->

<!--            <el-button v-show="showBtnFea" round size="mini" name="showStatisticFea" style="margin-left: 20px;"-->
<!--                       type="success" plain @click="showStatisticFea"-->
<!--            >分析结果-->
<!--            </el-button>-->

            <el-button v-show="showBtnDC"  size="mini" name="outputExcel" class="table-btn-right" style="margin-left: 20px;margin-top: 10px;" type="warning"
                       plain @click="outputExcel"
            >导出分析统计表
            </el-button>

            <el-button v-if="showYiji" round size="mini" name="showYiji" style="margin-left: 20px;" type="primary"
                       plain
            >显示一级分类
            </el-button>
          </div>
        </div>
      </div>
      <div :id="divType" v-if="showStaticsPic===true" style="width: 100%;  height: 400px;margin-top: 20px;"></div>
      <div id="statisticsTableDiv" v-show="showStaticsTable===true"
           style="width: 100%;  max-height: 200px;"
      >
        <el-table
          :id="tableID"
          :data="staticsTableData"
          style="width: 100%"
          :header-cell-style="{background:'#b1eaef',color:'#63666b'}"
          border fit
        >
          <el-table-column
            v-for="(item,i) in staticsTableCols"
            :label="item.title"
            :prop="item.field"
            :min-width="100"
            show-overflow-tooltip
          >
          </el-table-column>
        </el-table>
        <!--        <v-chart class="chart" :option="option" autoresize/>-->
      </div>
    </form>

  </div>
</template>

<script>
import axios from 'axios'
import * as echarts from 'echarts'
import {getCatalogQueryConfigListById, getCatalogStatisticsConfigListById} from "@/api/portal/catalog";
import {listDict} from "@/api/portal/tbportalDict";

let FileSaver = require('file-saver')
let XLSX = require('xlsx')
import _ from 'lodash'
// import gConfig from '@/utils/GlobalConfig'
import Bus from '@/utils/bus'

export default {
  name: 'AnalysisStatistic',
  components: {
    /*'v-chart': ECharts*/
  },
  data() {
    return {
      tableID:null,
      option: {},
      showBtnBar: false,
      showBtnTJB: false,
      showBtnBZT: false,
      showBtnDC: false,
      showBtnFea: false,
      showStaticsPic: false,
      showStaticsTable: true,
      staticsTableCols: [{
        field: '123',
        title: '统计表',
        align: 'center'
      }],
      staticsTableData: [{}],
      myEchart: null,
      echartType: 0, //0 echart图表 1统计表
      statisticsResultDiv: '',
      areaUnitsOptions: [],
      filedsOptions: [],
      showYiji: false,
      showOutExcel: false,
      config: {
        serviceStatisticsData: null,
        fieldData: [],
        fieldValues: {},
        statisticValueField: null, //统计值字段 相加的字段
        subMergeField: [],
        statisSeries: [],
        queryResultDataWithDZMJ: [], //查询分析统计的结果data，有叠置面积
        statisticField: null,
        areaUnit: null//统计的面积字段
      },
      analysisObject: {
        /*
         * @type String 图层标题
         */
        'layerCaption': '',
        'queryShowField': { 'en': '', 'cn': '' },
        /*
         * 字段对照表
         * @type Array 形如[{"en":"bsm","cn":"标识码"}]
         */
        'layerFields': [],
        /*
         * @type String 统计字段，如“dlbm”
         */
        'statisField': '',
        /*
         * 统计合并字段名称，如“qsdwmc”
         */
        'subMergeField': '',
        /*
         * 当前统计类型
         */
        'statisShowContent': '',
        'statisMulti': false,
        'statisContent': [],
        'statisSeries': [],
        'queryBtnTitle': '查询列表',
        'qsdmXzqDm': ''
      },
      colors: {
        'blackBlue': ['#011936', '#00343f', '#1db0b8', '#37c6c0', '#d0e9ff'],
        'highBlue': ['#33ccff', '#ff9617', '#19e4ff', '#00ffff', '#33ffe7'],
        'standard': ['#36e5ff', '#efff23', '#00ff64', '#ff9617', '#0d1836'],
        'standard1': ['#c12e34', '#0098d9', '#e6b600', '#2b821d', '#005eaa', '#339ca8'],
        'standard2': ['#00a9ad', '#d5feff'], //系统蓝绿配色
        'greenRed': ['#4ea397', '#22c3aa', '#7bd9a5', '#d0648a', '#f58db2', '#f2b3c9'],
        'redHigh': ['#893448', '#d95850', '#eb8146', '#ffb248', '#f2d643', '#ebdba4'],
        'yellowHigh': ['#ff715e', '#ffaf51', '#ffee51', '#797fba', '#715c87'],
        'eChartDefault': ['#c23531', '#2f4554', '#61a0a8', '#d48265', '#91c7ae', '#749f83', '#ca8622', '#bda29a', '#6e7074', '#5b7cbd'],
        'light': ['#fb7293', '#e7bcf3', '#8378ea', '#32c5e9', '#9fe6b8', '#37a2da', '#ffdb5c', '#f39e9e', '#f7e06f', '#6ff7d1'],
        'dark': ['#e69d87', '#8dc1a9', '#ea7e53', '#eedd78', '#73a373', '#73b9bc', '#7289ab', '#dd6b66', '#759aa0']
      }
    }
  },
  props: {
    attributeTable: {
      type: Object,
      default() {
        return {}
      }
    },
    overSource: {
      type: Object,
      default() {
        return {}
      }
    },
    divType: {
      type: String,
      default() {
        return ''
      }
    }
  },
  created() {
     this.createTableID();
  },
  mounted() {
    let that = this
    that.Init()
  },
  methods: {
    Init(){
      let that = this;
      axios.all([getCatalogQueryConfigListById({
        "serviceId": that.attributeTable.serviceId
      }), getCatalogStatisticsConfigListById({
        "serviceId": that.attributeTable.serviceId
      }),listDict({
        "queryType": "byDictKey",
        "dictKey": "areaUnit"
      })]).then(axios.spread(function (res1, res2,res3) {	// spread是将各请求结果拆分返回，如果不使用改方法，则最后的相应结果为一个数组[resp1, resp2]
          //第一个请求
          if (res1.data.queryData.length > 0) {
            that.config.fieldData = [];
            var obj = res1.data.queryData[0];
            that.analysisObject.layerCaption = obj.f_name;
            that.config.fieldData = JSON.parse(obj.f_fieldconfig);
          }
          //第二个请求
          if (res2.data.statisticsData.length > 0) {
            that.config.fieldValues = [];
            var obj = res2.data.statisticsData[0];
            that.config.fieldValues = JSON.parse(obj.f_fieldconfig);
          }
          //第三个请求
          if (res3.data.dictValue.length > 0) {
            that.areaUnitsOptions = [];
            for (var i in res3.data.dictValue) {
              var item = res3.data.dictValue[i];
              that.areaUnitsOptions.push({
                label: item.itemtext,
                value: item.itemvalue
              });
            }
            that.config.areaUnit=that.areaUnitsOptions[0].value;
          }
          that.InitUI();
        }
        )
      );
    },
    InitUI() {
      let that = this
      for (var statictisField in that.config.fieldValues) {
        for (var i in that.config.fieldData) {
          var field = that.config.fieldData[i]
          if (statictisField == field.f_field) {
            that.filedsOptions.push({
              'label': field.f_fieldcn,
              'value': field.f_field
            })
          }
        }
      }
      if (that.filedsOptions.length > 0) {
        that.config.statisticField = that.filedsOptions[0].value
      }
      that.startStatistic()
    },
    outputExcel() {
      let that = this
      var subTitle = that.getSubTitle(that.analysisObject.layerCaption, '代码', '统计')

      if (that.echartType != 1 && that.myEchart != null) {//echart图表
        //let index=document.getElementsByTagName('canvas').length-1;
        //let mycanvas=document.getElementsByTagName('canvas')[index]
        let mycanvas = (document.getElementById(that.divType)).getElementsByTagName('canvas')[0]
        let image = mycanvas.toDataURL('image/png')
        let $a = document.createElement('a')
        $a.setAttribute('href', image)
        $a.setAttribute('docontentwnload', subTitle)
        $a.click()
      } else {//表格
        // that.ExportExcelFile('main-statistics-table', subTitle)
        that.ExportExcelFile(that.tableID, subTitle)
      }
    },
    ExportExcelFile(id, filename) {
      var that = this
      // 设置当前日期
      let time = new Date()
      let year = time.getFullYear()
      let month = time.getMonth() + 1
      let day = time.getDate()
      let name = year + '' + month + '' + day
      // console.log(name)
      /* generate workbook object from table */
      //  .table要导出的是哪一个表格
      var wb = XLSX.utils.table_to_book(document.getElementById(id))
      /* get binary string as output */
      var wbout = XLSX.write(wb, {
        bookType: 'xlsx',
        bookSST: true,
        type: 'array'
      })
      try {
        //  name+'.xlsx'表示导出的excel表格名字
        FileSaver.saveAs(
          new Blob([wbout], { type: 'application/octet-stream' }),
          filename + '.xlsx'
        )
      } catch (e) {
        if (typeof console !== 'undefined') console.log(e, wbout)
      }
      return wbout
    },
    showStatisticBar() {
      let that = this
      //统计完成后自动打开柱状统计图
      that.echartType = 0
      that.showStaticsTable = false
      that.showStaticsPic = true
      this.$nextTick(() => {
        var temp = that.analysisObject.statisShowContent
        that.analysisObject.statisShowContent = that.analysisObject.statisContent[0].name
        var legend_data_bar = that.statisDataStandardLegendData()
        var xAxis_data_bar = that.statisDataStandardXAxis()
        var subTitle_bar = that.getSubTitle(that.analysisObject.layerCaption, '代码', '统计')
        that.statisBarChartTdytqClick(that.analysisObject.layerCaption, subTitle_bar, legend_data_bar, xAxis_data_bar)
        that.analysisObject.statisShowContent = temp
      })

    },
    showStatisticPie() {
      let that = this
      that.echartType = 0
      that.showBtnDC = true
      that.showStaticsPic = true
      that.showStaticsTable = false//显示表格
      this.$nextTick(() => {
        var temp = that.analysisObject.statisShowContent
        that.analysisObject.statisShowContent = that.analysisObject.statisContent[0].name
        var legend_data_pie = that.statisDataStandardLegendData()
        var xAxis_data_pie = that.statisDataStandardXAxis()
        var subTitle_pie = that.getSubTitle(that.analysisObject.layerCaption, '代码', '统计')
       //2022年9月1日 LQ 柱状图、饼状图都删除
        // that.statisPieChartTdytqClick(that.analysisObject.layerCaption, subTitle_pie, legend_data_pie, xAxis_data_pie)
        that.analysisObject.statisShowContent = temp
      })

    },
    showStatisticTable() {
      let that = this
      // document.getElementById("statisticsResultDiv").innerHTML="";
      //that.statisticsResultDiv="";//why20220330 上一行清空好使 这行不好使
      that.showStaticsPic = false
      that.showStaticsTable = true//显示表格
      that.echartType = 1
      that.resetStatisTable()
      that.showBtnDC = true
    },
    resetStatisTable() {
      var that = this
      var statisContent = that.getCurrentStatisContent()
      var statisItemLength = statisContent.length

      var tablecols = [], tabelContent = []
      //表头
      if (statisItemLength > 0) {
        var col = {
          field: 'mingcheng',
          title: '名称',
          align: 'center'

        }
        tablecols.push(col)
        //why20211119加入合计
        var col = {
          field: 'heji',
          title: '合计',
          align: 'center'

        }
        tablecols.push(col)
        var statisFieldslength = statisContent[0].data.length
        for (var i = 0; i < statisFieldslength; i++) {
          var col = {
            field: statisContent[0].data[i].fieldValue,
            title: statisContent[0].data[i].fieldTitle,
            align: 'center'

          }
          tablecols.push(col)
        }
      }

      //表格
      for (var i = 0; i < statisItemLength; i++) {
        var heji = 0
        var statisContentData = statisContent[i].data
        var statisFieldslength = statisContentData.length
        var content = {}
        content['mingcheng'] = statisContent[i].name
        for (var j = 0; j < statisFieldslength; j++) {
          content[statisContentData[j].fieldValue] = statisContentData[j].statisValue
          heji += parseFloat(statisContentData[j].statisValue)
        }
        content['heji'] = heji.toFixed(2)//why20211119合计
        tabelContent.push(content)
      }
      that.staticsTableCols = tablecols
      that.staticsTableData = tabelContent
      let staTables = {
        'type': that.divType,
        'content': {
          'staticsTableCols': tablecols,
          'staticsTableData': tabelContent
        }
      }
      Bus.$emit('createGBZCBProjectSaveStatisticTable', staTables)
    },
    showStatisticFea() {
      let that = this
      //that.startStatistic();
      that.overSource.clear()
      that.overSource.addFeatures(that.attributeTable.features)
    },
    startStatistic() {
      let that = this
      that.echartType = 0
      that.showStaticsTable = true
      that.showStaticsPic = false
      that.showBtnTJB = true
      that.showBtnBZT = true
      that.showBtnDC = true
      that.showBtnBar = true
      //that.showBtnFea=true;
      if (that.config.fieldValues.hasOwnProperty(that.config.statisticField)) {
        var statisticSetting = that.config.fieldValues[that.config.statisticField]
        var statisticValueField = null, addValueName = '重叠面积(公顷)'//why20211016合并值字段
        if (statisticSetting.hasOwnProperty('statisticValueField')) {
          statisticValueField = statisticSetting['statisticValueField']
          switch (statisticValueField) {
            case '#area':
              addValueName = '重叠面积(公顷)'
              break
            case '#length':
              addValueName = '长度(m)'
              break
            //2021年11月30日 LQ 如果使用超图自带的smarea，那么使用汉字
            case'smarea':
              addValueName = '重叠面积(公顷)'
              break
            default:
              addValueName = statisticValueField
              break
          }
        }

        var subMergeField = statisticSetting['mergeFields'][0]//先用第一个测试
        var statisSeries = statisticSetting['fieldValues']
        that.analysisObject.statisMulti = false
        var statisSerieStructure = that.getStatisSeriesStructure(statisSeries)
        var statisSerieStructure1 = that.getStatisSeriesStructure1(statisSeries)
        //常规统计
        var numStatic = { 'name': '数量(个)', 'data': _.cloneDeep(statisSerieStructure) }
        var areaStatic = { 'name': addValueName, 'data': _.cloneDeep(statisSerieStructure) }

        //合并统计
        var mergeStatic = []
        //一级分类统计
        var mergeStatic1 = []
        that.statisticsQueryResultData(that.attributeTable.features, numStatic, areaStatic, that.config.statisticField, statisticValueField,
          subMergeField, mergeStatic, mergeStatic1, statisSerieStructure, statisSerieStructure1, true)
        that.showStatisticTable();

      }
    },
    /*
         * 统计查询结果
         * @param {type} data
         * @param {type} numStatic 常规统计
         * @param {type} areaStatic 常规统计
         * @param {type} statisField 统计字段
         * @param {type} subMergeField 合并字段
         * @param {type} statisticValueField 统计值字段
         * @param {type} mergeStatic 合并统计
         * @param {type} mergeStatic1 一级分类统计
         * @param {type} statisSerieStructure 统计项
         * @param {type} statisSerieStructure1 统计项
         * @param {type} isLastStatis
         * @returns {undefined}
         */
    statisticsQueryResultData: function(data, numStatic, areaStatic, statisField, statisticValueField, subMergeField,
      mergeStatic, mergeStatic1, statisSerieStructure, statisSerieStructure1, isLastStatis) {
      var that = this
      var thisTimewkid = null
      that.config.queryResultDataWithDZMJ = that.config.queryResultDataWithDZMJ.concat(data)
      if (data.length > 0) {
        for (var i = 0; i < data.length; i++) {
          var obj = data[i]
          var attributes = obj.getProperties()
          var sta1 = attributes[statisField] //统计项
          if (thisTimewkid == null) {
            var Coordinates = attributes.geometry.getFirstCoordinate()
            if (Coordinates && Coordinates.length > 0) {
              thisTimewkid = that.GetProjectWKID(Coordinates[0])
            }
          }

          var addValue = 0

          if (statisticValueField && statisticValueField != '#area') {//如果设置了统计值字段 则用统计值字段统计
            var thisarea = parseFloat(attributes[statisticValueField])//这个结果本身是平方米
            if (that.config.areaUnit === 1) {//公顷
              //2021年12月1日 LQ 之前公顷的面积写错了。这次改回来。
              thisarea = thisarea / 10000
              attributes.DZMJ = thisarea
              addValue = thisarea

            } else if (that.config.areaUnit === 2) {//万亩
              thisarea = thisarea / 10000 * 15 / 10000
              attributes.DZMJ = thisarea
              addValue = thisarea

            } else if (that.config.areaUnit === 3) {//亩
              thisarea = thisarea / 10000 * 15
              attributes.DZMJ = thisarea
              addValue = thisarea

            } else if (that.config.areaUnit === 4) {//平方米，1公顷=10000平方米
              attributes.DZMJ = thisarea.toFixed(2)
              addValue = parseFloat(thisarea.toFixed(2))
            } else if (that.config.areaUnit === 5) {//平方公里，1平方公里=100公顷
              thisarea = thisarea / 1000000
              attributes.DZMJ = thisarea
              addValue = thisarea
            }

            attributes.DZMJ = addValue
          } else if (statisticValueField && statisticValueField == '#length') {
            var featureGeo = attributes.geometry.clone()
            if (thisTimewkid) {
              featureGeo = attributes.geometry.clone().transform('EPSG:4490', thisTimewkid)
            }
            var thislength = parseFloat(featureGeo.getLength()) //这个计算的面积就是和ArcGIS一样了//这是平面的面积，EPSG:4532是CGCS2000的43度带投影
            attributes.DZMJ = thislength.toFixed(2)
            addValue = thislength
          } else {//如果没设置统计值字段 则用几何面积统计
            var featureGeo = attributes.geometry.clone()
            if (thisTimewkid) {
              featureGeo = attributes.geometry.clone().transform('EPSG:4490', thisTimewkid)
            }
            var thisarea = parseFloat(featureGeo.getArea()) //这个计算的面积就是和ArcGIS一样了//这是平面的面积，EPSG:4532是CGCS2000的43度带投影。单位是平方米
            thisarea = parseFloat(thisarea.toFixed(2))
            if (that.config.areaUnit === 1) {//公顷
              thisarea = thisarea / 10000
              attributes.DZMJ = thisarea
              addValue = thisarea

            } else if (that.config.areaUnit === 2) {//万亩
              thisarea = thisarea / 10000 * 15 / 10000
              attributes.DZMJ = thisarea
              addValue = thisarea

            } else if (that.config.areaUnit === 3) {//亩
              thisarea = thisarea / 10000 * 15
              attributes.DZMJ = thisarea
              addValue = thisarea

            } else if (that.config.areaUnit === 4) {//平方米，1公顷=10000平方米
              attributes.DZMJ = thisarea.toFixed(2)
              addValue = parseFloat(thisarea.toFixed(2))
            } else if (that.config.areaUnit === 5) {//平方公里，1平方公里=100公顷
              thisarea = thisarea / 1000000
              attributes.DZMJ = thisarea
              addValue = thisarea
            }
          }

          //why20211016
          for (var j = 0; j < numStatic.data.length; j++) {
            if (sta1 == numStatic.data[j].fieldValue) {//
              var num = parseInt(numStatic.data[j].statisValue)
              numStatic.data[j].statisValue = num + 1 //数量统计
              var area = parseFloat(areaStatic.data[j].statisValue)
              areaStatic.data[j].statisValue = area + parseFloat(addValue) //面积统计
              //专项统计
              if (subMergeField) {
                var sta2 = attributes[subMergeField] //合并项
                var isadd = false
                for (var k = 0; k < mergeStatic.length; k++) {
                  var itemName = mergeStatic[k].name
                  if (sta2 == itemName) {
                    mergeStatic[k].data[j].statisValue += addValue //面积统计
                    isadd = true
                    break
                  }
                }
                if (!isadd) {
                  var itemStatic = { 'name': sta2, 'data': _.cloneDeep(statisSerieStructure) }
                  itemStatic.data[j].statisValue += addValue //面积统计
                  mergeStatic.push(itemStatic)
                }
              }
              break
            }
          }
          //添加一级统计
          if (that.analysisObject.statisMulti && subMergeField) {
            for (var j = 0; j < statisSerieStructure1.length; j++) {
              if (sta1.startWith(statisSerieStructure1[j].fieldValue) == 0) {
                var sta2 = attributes[subMergeField] //合并项
                var isadd = false
                for (var k = 0; k < mergeStatic1.length; k++) {
                  var itemName = mergeStatic1[k].name
                  if (sta2 == itemName) {
                    mergeStatic1[k].data[j].statisValue += addValue //面积统计
                    isadd = true
                    break
                  }
                }
                if (!isadd) {
                  var itemStatic = { 'name': sta2, 'data': _.cloneDeep(statisSerieStructure1) }
                  itemStatic.data[j].statisValue += addValue //面积统计
                  mergeStatic1.push(itemStatic)
                }
              }
            }
          }
        }
        if (isLastStatis) {
          for (var i = 0; i < areaStatic.data.length; i++) {
            var statisValue = parseFloat(areaStatic.data[i].statisValue)
            if (statisValue == 0) {
              numStatic.data.splice(i, 1)
              areaStatic.data.splice(i, 1)
              i--
            } else {
              areaStatic.data[i].statisValue = statisValue.toFixed(2)
            }
          }
          that.analysisObject.statisContent = []
          that.analysisObject.statisShowContent = '分类统计'
          that.analysisObject.statisContent.push({ 'name': '分类统计', 'statisContent': [numStatic, areaStatic] })
          if (mergeStatic1.length > 0) {
            mergeStatic1 = that.statisContentFixed(mergeStatic1)
            that.analysisObject.statisContent.push({ 'name': '一级分类', 'statisContent': mergeStatic1 })
          }
          if (mergeStatic.length > 0) {
            mergeStatic = that.statisContentFixed(mergeStatic)
            that.analysisObject.statisContent.push({ 'name': '二级分类', 'statisContent': mergeStatic })
          }
          //统计完成后自动打开柱状统计图
          var temp = that.analysisObject.statisShowContent
          that.analysisObject.statisShowContent = that.analysisObject.statisContent[0].name
          var legend_data_bar = that.statisDataStandardLegendData()
          var xAxis_data_bar = that.statisDataStandardXAxis()
          var subTitle_bar = that.getSubTitle(that.analysisObject.layerCaption, '代码', '统计')
          //2022年7月12日 LQ 先显示表格
          that.showStatisticTable();
       //   that.statisBarChartTdytqClick(that.analysisObject.layerCaption, subTitle_bar, legend_data_bar, xAxis_data_bar)
          that.analysisObject.statisShowContent = temp
        }
      }
      //}
    },
    statisContentFixed: function(mergeStatic) {
      if (mergeStatic.length > 0) {
        for (var i = 0; i < mergeStatic[0].data.length; i++) {
          var isZero = true
          for (var j = 0; j < mergeStatic.length; j++) {
            var statisValue = parseFloat(mergeStatic[j].data[i].statisValue)
            if (statisValue != 0) {
              mergeStatic[j].data[i].statisValue = statisValue.toFixed(2)
              isZero = false
            }
          }
          if (isZero) {
            for (var j = 0; j < mergeStatic.length; j++) {
              mergeStatic[j].data.splice(i, 1)
            }
            i--
          }
        }
      }
      return mergeStatic
    },
    /*
        * 将画的面导出成txt文件
        *   * @param {xjwd} 经纬度坐标的X坐标
        */
    GetProjectWKID: function(xjwd) {
      //120,123 126 129 132 135
      var wkid = null
      if (xjwd > 118.5 && xjwd < 121.5) {
        wkid = 'EPSG:4528'
      } else if (xjwd >= 121.5 && xjwd < 124.5) {
        wkid = 'EPSG:4529'
      } else if (xjwd >= 124.5 && xjwd < 127.5) {
        wkid = 'EPSG:4530'
      } else if (xjwd >= 127.5 && xjwd < 130.5) {
        wkid = 'EPSG:4531'
      } else if (xjwd >= 130.5 && xjwd < 133.5) {
        wkid = 'EPSG:4532'
      } else if (xjwd >= 133.5 && xjwd < 136.5) {
        wkid = 'EPSG:4533'
      }
      return wkid
    },
    /*
        * 生成动态饼状图
        * @param {string} title_text 标题
        * @param {string} title_subtext 子标题
        * @param {object} legend_data 按类型汇总结构，如
        * [
        * {"name":"数量","data":[1,2,3,4,5,6,7,8,9]},
        * {"name":"长度","data":[1,2,3,4,5,6,7,8,9]},
        * {"name":"面积","data":[1,2,3,4,5,6,7,8,9]}
        * ]
        * @param {array} xAxis_data x轴内容
        * @returns {undefined}
        */
    statisPieChartTdytqClick: function(title_text, title_subtext, legend_data, xAxis_data) {
      var that = this
      if (that.myEchart != null && that.myEchart != '' && that.myEchart != undefined) {
        //that.myEchart.dispose();
      }
      //that.myEchart = echarts.init(document.getElementById('statisticsResultDiv'));
      that.myEchart = echarts.init(document.getElementById(that.divType))
      var legend_content = []
      var seriesArray = []
      var length = legend_data.length
      var radius = 80 / length + '%'
      for (var i = 0; i < length; i++) {
        var legend = legend_data[i]
        var seriesData = []
        for (var j = 0; j < xAxis_data.length; j++) {
          seriesData.push({ 'name': xAxis_data[j], 'value': legend.data[j] })
        }
        var centerX = 50 / length * (i * 2 + 1) + '%'
        var centerY = '40%'
        legend_content.push(legend.name)
        seriesArray.push({
          'name': legend.name,
          'type': 'pie',
          'radius': radius,
          'center': [centerX, centerY],
          'data': seriesData,
          'itemStyle': {
            'emphasis': {
              shadowBlur: 10,
              shadowOffsetX: 0,
              shadowColor: 'rgba(0, 0, 0, 0.5)'
            }
          }
        })
      }
      // 指定图表的配置项和数据
      var option = {
        title: {
          text: title_text,
          subtext: title_subtext,
          x: 'center'
        },
        color: that.colors.standard1,
        toolbox: {
          show: true,
          orient: 'vertical',
          left: 'right',
          top: 'center',
          feature: {
            mark: { show: true },
            dataView: { show: true, readOnly: false },
            //   magicType: {show: true, type: ['line', 'bar', 'stack', 'tiled']},
            //    restore: {show: true},
            saveAsImage: { show: true }
          }
        },
        tooltip: {
          trigger: 'item',
          formatter: '{a} <br/>{b} : {c} ({d}%)'
        },
        legend: {
          x: 'center',
          y: '80%'
          //data: xAxis_data
        },
        series: seriesArray
      }
      // 使用刚指定的配置项和数据显示图表。
      that.myEchart.setOption(option, { notMerge: true })
    },
    /*
        * 生成动态柱状图
        * @param {string} title_text 标题
        * @param {string} title_subtext 子标题
        * @param {object} legend_data 按类型汇总结构，如
        * [
        * {"name":"数量","data":[1,2,3,4,5,6,7,8,9]},
        * {"name":"长度","data":[1,2,3,4,5,6,7,8,9]},
        * {"name":"面积","data":[1,2,3,4,5,6,7,8,9]}
        * ]
        * @param {array} xAxis_data x轴内容
        * @returns {void}
        */
    statisBarChartTdytqClick: function(title_text, title_subtext, legend_data, xAxis_data) {
      var that = this
      if (that.myEchart != null && that.myEchart != '' && that.myEchart != undefined) {
        //that.myEchart.dispose();
      }
      //that.myEchart = echarts.init(document.getElementById('statisticsResultDiv'));
      that.myEchart = echarts.init(document.getElementById(that.divType))
      var length = legend_data.length
      var legend_content = []
      var seriesArray = []
      var yAxis_data = []
      var yAxis1 = []
      for (var i = 0; i < length; i++) {
        var legend = legend_data[i]
        legend_content.push(legend.name)
        var unit = legend.name.split(/\(|\)|（|）/)[1]
        if (yAxis1.indexOf(unit) < 0) {
          yAxis1.push(unit)
          if (yAxis1.length == 1) {
            yAxis_data.push({ 'type': 'value', 'name': unit })
          } else {
            yAxis_data.push({ 'type': 'value', 'name': unit, 'position': 'right' })
          }
        }
        var seriesItem = {
          'name': legend.name,
          'type': 'bar',
          'data': legend.data
        }
        if (yAxis1.indexOf(unit) > 0) {
          seriesItem['yAxisIndex'] = yAxis1.indexOf(unit)
        }
        seriesArray.push(seriesItem)
      }
      // 指定图表的配置项和数据
      that.option = {
        title: {
          text: title_text, //标题
          subtext: title_subtext, //副标题
          x: 'center'
        },
        color: that.colors.standard1,
        toolbox: {
          show: true,
          orient: 'vertical',
          left: 'right',
          top: 'center',
          feature: {
            mark: { show: true },
            dataView: { show: true, readOnly: false },
            magicType: { show: true, type: ['line', 'bar', 'stack', 'titled'] },
            restore: { show: true },
            saveAsImage: { show: true }
          }
        },
        tooltip: {
          trigger: 'axis'
        },
        legend: {
          //data: legend_content, //图例数据
          left: 'left'
        },
        xAxis: {
          data: xAxis_data, //X轴显示的文字
          axisLabel: {
            interval: 0,
            rotate: 0,
            formatter: function(value) {
              var ret = ''
              var maxLength = 3
              var valLength = value.length
              var rowN = Math.ceil(valLength / maxLength)
              if (rowN > 1) {
                for (var i = 0; i < rowN; i++) {
                  var temp = ''
                  var start = i * maxLength
                  var end = start + maxLength
                  temp = value.substring(start, end) + '\n'
                  ret += temp
                }
                return ret
              } else {
                return value
              }
            }
          }
        },
        yAxis: yAxis_data,
        series: seriesArray
      }
      // 使用刚指定的配置项和数据显示图表。
      that.myEchart.setOption(that.option)
      //myChart.setOption(that.option)
    },
    /**
     * 字符串处理，移除，添加
     * @param {string} title
     * @param {string} removeStr
     * @param {string} addStr
     * @returns {string}
     */
    getSubTitle: function(title, removeStr, addStr) {
      var result = title.replace(removeStr, '')
      return result + addStr
    },
    /**
     *
     * @returns {Array|StatisDataStandardXAxis.xAxis_data}
     */
    statisDataStandardXAxis: function() {
      var that = this
      var xAxis_data = []
      var statisContent = that.getCurrentStatisContent()
      if (statisContent.length > 0) {
        var statisItem = statisContent[0]
        for (var j = 0; j < statisItem.data.length; j++) {
          xAxis_data.push(statisItem.data[j].fieldTitle)
        }
      }
      return xAxis_data
    },
    /**
     *
     * @returns {Array|StatisDataStandardLegendData.legend_data}
     */
    statisDataStandardLegendData: function() {
      var that = this
      var legend_data = []
      var statisContent = that.getCurrentStatisContent()
      for (var i = 0; i < statisContent.length; i++) {
        var statisItem = statisContent[i]
        var statisData = []
        for (var j = 0; j < statisItem.data.length; j++) {
          statisData.push(statisItem.data[j].statisValue)
        }
        legend_data.push({
          'name': statisItem.name,
          'data': statisData
        })
      }
      return legend_data
    },
    /*
         * 根据统计项获取一级统计结构
         * @param {type} statisSeries
         * @returns {Array}
         */
    getStatisSeriesStructure1: function(statisSeries) {
      var that = this
      var result = []
      for (var i = 0; i < statisSeries.length; i++) {
        var obj = statisSeries[i]
        var statisTitle = obj.title
        var statisValue = obj.value
        result.push({ 'fieldTitle': statisTitle, 'fieldValue': statisValue, 'statisValue': 0 })
      }
      return result
    },
    /*
        * 获取当前统计信息
        * @returns {undefined}
        */
    getCurrentStatisContent: function() {
      var that = this
      var statisContent = []
      for (var i = 0; i < that.analysisObject.statisContent.length; i++) {
        var obj = that.analysisObject.statisContent[i]
        if (obj.name == that.analysisObject.statisShowContent) {
          statisContent = obj.statisContent
          break
        }
      }
      return statisContent
    },
    /*
        * 根据统计项获取统计结构
        * @param {type} statisSeries
        * @returns {Array}
        */
    getStatisSeriesStructure(statisSeries) {
      var that = this
      var result = []
      for (var i = 0; i < statisSeries.length; i++) {
        var obj = statisSeries[i]
        var statisTitle = obj.title
        var statisValue = obj.value
        var substatisSeries = obj.statisSeries
        if (substatisSeries) {
          if (substatisSeries.length > 0) {
            result = result.concat(that.getStatisSeriesStructure(substatisSeries))
            that.analysisObject.statisMulti = true
          }
        } else {
          result.push({ 'fieldTitle': statisTitle, 'fieldValue': statisValue, 'statisValue': 0 })
        }
      }
      return result
    },
    handleClose() {
      let that = this
      that.attributeTable.analysisStaticsShow = 'close'
    },
    handleStatics() {

    },
    createGuid() {
      return 'xxxxxxxx-xxxx-4xxx-yxxx'.replace(/[xy]/g, function (c) {
        let r = Math.random() * 16 | 0,
          v = c == 'x' ? r : (r & 0x3 | 0x8);
        return v.toString(16);
      });
    },
    createTableID(){
      this.tableID=this.createGuid();
    },

  },
  directives: {//到这里了，看看自定义组件怎么个用
  }
}
</script>

<style scoped>
.tablename{
  float: left;
  font-size: 20px;
}
.table-btn-right{
  float: right;
}
::v-deep .el-table__header-wrapper{
  padding: 3px 0;
  /*height: 30px;*/
}
::v-deep .el-table--medium .el-table__cell {
  padding: 5px 0;
}

.analysis-statistics-form .el-select {
  width: 150px;
  margin: 5px;
}

.analysis-statistics-form {
  /*margin: 20px 10px 0px -80px;*/
  /*  margin:-30px -20px;*/
}

.statisticBtns {
  display: inline;
  margin-left: 20px;
  vertical-align: unset;
}

#myChart {
  width: 300px;
  height: 300px;
}
</style>
